<!-- 我的 -->
<template>
	<view id="mine_box">
		<view class="mine_info" @click="login">
			<view class="mine_img">
				<!-- <open-data type="userAvatarUrl"></open-data> 已弃用-->
				<u-avatar :src="avatar" size='120'></u-avatar>
			</view>
			<view class="mine_name">
				<view>{{screenName}}</view>
			</view>
		</view>
		<view class="mine_perMer">
			<view class="mine_label">
				<view class="label_icon">
					<my-icon name="my_user_write" title="个人中心" size="40" mode="right" titleColor="#fff"></my-icon>
				</view>
			</view>
			<view class="mine_icon">
				<u-row gutter="12">
					<u-col span="3">
						<view class="mine_icon_center" @click="gotoPage('mycollect')">
							<my-icon name="my_heart" title="收藏" size="58" mode="bottom"></my-icon>
						</view>
					</u-col>
					<u-col span="3">
						<view class="mine_icon_center" @click="gotoPage('footprint')">
							<my-icon name="my_foot" title="足迹" size="58" mode="bottom"></my-icon>

						</view>
					</u-col>
					<u-col span="3">
						<view class="mine_icon_center" @click="gotoPage('myneed')">
							<my-icon name="my_book" title="需求" size="58" mode="bottom"></my-icon>
						</view>
					</u-col>
					<u-col span="3">
						<view class="mine_icon_center" @click="gotoPage('authentication')">
							<my-icon name="my_user" title="实名认证" size="58" mode="bottom"></my-icon>
						</view>
					</u-col>
				</u-row>
				<u-gap height="30"></u-gap>
				<u-row gutter="12">
					<u-col span="3">
						<view class="mine_icon_center" @click="gotoPage('orderprocess')">
							<my-icon name="my_handler" title="订单处理" size="58" mode="bottom"></my-icon>
						</view>
					</u-col>
					<u-col span="3">
						<view class="mine_icon_center" @click="gotoPage('my_publish')">
							<my-icon name="my_flay" title="农产品" size="58" mode="bottom"></my-icon>
						</view>
					</u-col>
					<u-col span="3">
						<view class="mine_icon_center" @click="gotoPage('addressList')">
							<my-icon name="my_user" title="地址管理" size="58" mode="bottom"></my-icon>
						</view>
					</u-col>
					<u-col span="3">
						<view class="mine_icon_center" @click="moreHandler">
							<my-icon name="more" title="更多" size="58" mode="bottom"></my-icon>
						</view>
					</u-col>
				</u-row>
			</view>
		</view>
		<!-- <view class="mine_perMer gray_scale"> -->
		<view class="mine_perMer">
			<view class="mine_label">
				<view class="label_icon">
					<my-icon name="my_store" title="我是企业" size="40" mode="right" titleColor="#fff"></my-icon>
				</view>
			</view>
			<view class="mine_icon2">
				<view class="icon2_bac" @click="sendGoods">
					<view class="icon2_position">
						<my-icon name="process" title="加工产品" mode="right" size="58"></my-icon>
					</view>
				</view>
				<view class="icon2_bac">
					<view class="icon2_position">
						<my-icon name="corp_profile" title="资质认证" mode="right" size="58"></my-icon>
					</view>
				</view>
			</view>
		</view>
		<minePopup v-model="showPopup"></minePopup>
	</view>
</template>

<script>
	import {
		mapGetters,
		mapState
	} from 'vuex'
	import minePopup from "components/mineMenu/mineMenu.vue"
	import myIcon from "components/common/myIcon"
	export default {
		data() {
			return {
				showPopup: false,
			}
		},
		components: {
			minePopup,myIcon
		},
		computed: {
			...mapState({
				screenName: state => state.userStore.screenName,
				avatar: state => state.userStore.avatar
			}),
			...mapGetters({
				userLoginState: "getUserLoginState",
			})
		},
		methods: {

			login() {
				// if (this.userLoginState) return console.log("用户已登录")
				if (!this.userLoginState) return this.pushNewPage("login")
				this.showPopup = true

			},
			closePopup() {
				this.showPopup = false
			},
			gotoPage(pageName){
				this.pushNewPage(pageName)
			},
			sendGoods(){
				this.pushNewPage("sends_goods",{sendType:1})
			},
			moreHandler(){
				this.$showTitleModule("更多功能敬请期待")
			}
		},
	}
</script>

<style>
	@import url("mine.css");
</style>
